
<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>cisco iOS</title>

    <meta content="width=device-width, initial-scale=1.0" name="viewport" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    
    <link rel="stylesheet" href="styles.css" type="text/css" media="all" />
</head>
<body>
    <span id="ch">W</span>
    <div id="app">
        <ul class="cmds console">
            <li v-for="(h, i) in history" v-bind:class="{active: i == history_ptr && !curr_ptr}"><span v-if="h.type == 'cmd'"><span>{{ h.hostname }}</span><span v-if="!h.enabled">></span><span v-else><span v-if="h.mode">({{ h.mode }})</span>#</span> <strong>{{ h.description}}</strong></span><span v-if="h.type == 'text'">{{ h.text }}</span></li>
            <li v-bind:class="{active: curr_ptr}"><span>{{ hostname }}</span><span v-if="!enabled">></span><span v-else><span v-if="mode">({{ mode }})</span>#</span> <span class="cmd">{{ cmd }}<span class="cursor" v-bind:style="{left: (ch_w*pos)+'px'}"></span></span> <span class="help">{{ help }}</span></li>
        </ul>
        <ul class="cmds helps">
            <template v-for="group in helps" v-if="group.commands.length > 0">
                <li class="help active" style="margin-top: 10px;">{{ group.group }}</li>
                <li v-for="h in group.commands" class="help"><span>{{ hostname }}</span><span v-if="!h.enabled">></span><span v-else><span v-if="h.mode">({{ h.mode }})</span>#</span> <strong>{{ h.description}}</strong></li>
            </template>
        </ul>
    </div>

    <!-- Global scripts -->
    <script src="libs/vue.js" type="text/javascript"></script>
    <script src="libs/flatMap-polyfill.js" type="text/javascript"></script>
    <script src="src/router.cmds.js" type="text/javascript"></script>
    <script src="src/switch.cmds.js" type="text/javascript"></script>
    <script src="src/index.js" type="text/javascript"></script>
    <script src="src/utils.js" type="text/javascript"></script>
</body>

</html>